<template>
    <div class="wrap pt20 tc">
        <div>
            <img class="mb20" src="../assets/imgs/logo.svg" alt="">
            <h1 class="mb40">华杉商场系统登录</h1>
        </div>
        <p class="mb20">
            <el-input
                class="input"
                v-model="form.username"
                placeholder="请输入用户名"
                prefix-icon="User"
            />
        </p>
        <p class="mb40">
            <el-input
                class="input"
                v-model="form.password"
                placeholder="请输入用户密码"
                prefix-icon="Lock"
                type="password"
                show-password
            />
        </p>
        <el-button @click="goHome" class="login-btn" type="warning">登 录</el-button>
    </div>
</template>

<script setup>
import { reactive } from 'vue';
import { useRouter } from 'vue-router';


const form = reactive({
    username:"",
    password:""
})
const router = useRouter();
const goHome = ()=>{
    router.push("/");
}
</script>

<style scoped>
.wrap{width: 350px;margin: 0 auto;}
img{height: 55px;}
h1{font-size: 18px;font-weight: normal;}
/* .input{width: 100%;} */
.login-btn{width: 100%;}
</style>